.elsa-navigator {
  font-size: 13px;

  .logout {
    display: none;
    font-size: 12px;
    position: absolute;
    bottom: 10px;
    right: 10px;
    -webkit-app-region: no-drag;
  }

  .user-info {
    position: relative;
    padding-top: 50px;
    padding-bottom: 20px;
    text-align: center;
    -webkit-app-region: drag;

    .user-img {
      border-radius: @user-img-size;
      height: @user-img-size;
      width: @user-img-size;
      -webkit-app-region: no-drag;
    }

    .user-name {
      font-size: 12px;
      -webkit-app-region: no-drag;
    }

    &:hover {
      .logout {
        display: block;
      }
    }
  }

  .nav {
    border-top: 1px solid @border-color;
    padding: 10px;
    margin: 0 10px 10px 10px;

    .btn {
      margin-right: 10px;
    }

    h3 {
      font-size: 12px;
      font-weight: normal;
      margin-bottom: 10px;
    }

    ul {
      margin-bottom: 10px;

      li {
        padding: 8px;
        opacity: 0.7;
        cursor: pointer;

        &:hover {
          opacity: 1;
        }

        &.active {
          background-color: @highlight-color;
          border-radius: 3px;
          color: #fff;
          opacity: 1;

          .btn {
            color: #fff;
            opacity: 1;
          }
        }
      }
    }
  }
}